<template>
    <div>
        <avue-form ref="form" v-model="obj" :option="option"
                   @reset-change="emptytChange"
                   @submit="submit">

        </avue-form>
    </div>
</template>

<script>

    import {uploadPath} from "@/config/env";
    export default {
        data() {
            return {
                obj: {},
                initSuccess: false,
                defaultData: {
                    pid: null,
                    name: null,
                    twoUrl: null,
                    url: null,
                    icon: null,
                    sort: null,
                    root: null,
                    disable: null,

                },
            }
        },
        props: {
            closeDialog: [],
            uri: {},
            rowData: {},
        },
        computed: {
            option() {
                return {
                    submitBtn: true,
                    emptyBtn: true,
                    submitText: '提交',
                    emptyText: "关闭",
                    column: [
                        {
                            label: '父级 ',
                            prop: 'pid',
                            type: 'tree',
                            labelWidth: 110,
                            span: 20,
                            display: true,
                            dicData: this.treeData, 
                            props: {
                                value: "id",
                                label: "name",
                                children: "children"
                            },
                            rules: [{
                                required: true,
                                message: "请选择 父级 ",
                                trigger: "blur"
                            }]
                        },
                        {
                            label: '菜单名',
                            prop: 'name',
                            labelWidth: 110,
                            maxlength: 32,
                            showWordLimit: true,
                            span: 20,
                            rules: [{
                                required: true,
                                message: "请输入 菜单名",
                                trigger: "blur"
                            }]
                        },
                        {
                            label: '第二路由 ',
                            prop: 'twoUrl',
                            labelWidth: 110,
                            maxlength: 128,
                            showWordLimit: true,
                            span: 20,
                            rules: [{
                                required: false,
                                message: "请输入 第二路由 ",
                                trigger: "blur"
                            }]
                        },
                        {
                            label: '菜单url',
                            prop: 'url',
                            labelWidth: 110,
                            maxlength: 128,
                            showWordLimit: true,
                            span: 20,
                            rules: [{
                                required: false,
                                message: "请输入 菜单url",
                                trigger: "blur"
                            }]
                        },
                        {
                            label: '图标',
                            prop: 'icon',
                            labelWidth: 110,
                            maxlength: 32,
                            showWordLimit: true,
                            span: 20,
                            rules: [{
                                required: true,
                                message: "请输入 图标",
                                trigger: "blur"
                            }]
                        },
                        {
                            label: '排序',
                            prop: 'sort',
                            type: 'number',
                            labelWidth: 110,
                            precision: 0,  //保留小数位,
                            min: 0,
                            max: 999999999,
                            step: 1,
                            row: true,
                            span: 20,
                            rules: [{
                                required: true,
                                message: "请输入 排序",
                                trigger: "blur"
                            }]
                        },
                        {
                            label: '目录级别 ',
                            prop: 'root',
                            type: 'number',
                            labelWidth: 110,
                            precision: 0,  //保留小数位,
                            min: 0,
                            max: 999999999,
                            step: 1,
                            row: true,
                            span: 20,
                            rules: [{
                                required: true,
                                message: "请输入 目录级别 ",
                                trigger: "blur"
                            }]
                        },
                        {
                            label: '禁用 ',
                            prop: 'disable',
                            type: 'number',
                            labelWidth: 110,
                            precision: 0,  //保留小数位,
                            min: 0,
                            max: 999999999,
                            step: 1,
                            row: true,
                            span: 20,
                            rules: [{
                                required: true,
                                message: "请输入 禁用 ",
                                trigger: "blur"
                            }]
                        },

                    ]
                }
            }
        },
        created() {
            this.obj = this.defaultData;
            this.obj.pid = this.rowData.pid;
            this.treeData = JSON.parse(JSON.stringify(this.rowData.pidDic));
            this.initSuccess = true;
        },
        methods: {
            emptytChange() {
                this.closeDialog(false);
            },
            submit(form, done) {
                this.crud.post(this.uri.info, this.obj).then((res) => {
                    console.debug(res);
                    if (res.data.code == 200) {
                       this.closeDialog(true,res.data.data);
                    }
                    done(form);
                }).catch((err) => {
                    console.error(err);
                    done(form);
                })
            },
        }
    }
</script>
